<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title></title>
    <link href="../../../static/css/bootstrap.min.css?v=3.3.5" rel="stylesheet">
    <link href="../../../static/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="../../../static/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <link href="../../../static/css/plugins/datepicker/bootstrap-datetimepicker.min.css" rel="stylesheet">
    <link href="../../../static/css/animate.min.css" rel="stylesheet">
    <link href="../../../static/css/style.min.css?v=4.0.0" rel="stylesheet">
    <link href="../../../static/css/plugins/pagination/pagination.css" rel="stylesheet">
    <link href="../../../static/css/plugins/popup/popup.css" rel="stylesheet">
    <link href="../../../static/css/common.css" rel="stylesheet">
    <base target="_blank">
    <style>
        .bootstrap-table .table>tbody>tr>td{
          height:45px;
        }
        .datepicker-box{
          display:flex;
          align-items:center;
          flex-wrap:wrap;
          justify-content:flex-start;
					margin-bottom:20px;
        }
        .datepicker-box input{
          border:1px solid #ccc;
          border-radius:4px;
          width:300px;
          
        }
        /* .datepicker-box span{
          margin-bottom:20px;
        } */
        .datepicker-month{
          display:none;
        }
        .choose-type{
          display:flex;
          align-items:center;
          margin-bottom:10px;
        }
        .choose-type>div{
          border:1px solid #ccc;
          height:30px;
          line-height:30px;
          border-radius:15px;
          display:inline-flex;
          overflow:hidden;
          margin:0 5px;
        }
        .choose-type span{
          padding:0 8px;
          cursor:pointer;
        }
        .choose-type span.active{
          background:#2f4050;
          color:#fff;
        }
				.search-bt{
					margin-bottom: 10px!important;
				}
    </style>
  </head>
  <body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <h5>综合统计</h5>
            </div>
            <div class="ibox-content">
              <div class="choose-type">
                  按
                  <div>
                      <span class="choose-date active" data-type='day'>日期</span>
                      <span class="choose-month" data-type='month'>月份</span>
                  </div>
                  筛选
              </div>
              <div class="datepicker-date">
                <div class="datepicker-box">
                    <input type="text" id="startDate" name="reservatTime"  placeholder="开始日期" readonly class="form_datetime">
                    <span>-</span>
                    <input type="text"id="endDate" name='leaveTime' placeholder="结束日期" readonly class="form_datetime">
                </div>
              </div>
              <div class="datepicker-month">
                <div class="datepicker-box">
                    <input type="text" id="startMonth" name="reservatTime"  placeholder="开始月份" readonly class="form_datetime">
                    <span>-</span>
                    <input type="text"id="endMonth" name='leaveTime' placeholder="结束月份" readonly class="form_datetime">
                </div>
              </div>
							<button class="btn btn-primary search-bt">搜索</button>
                   <table id="tableFromData" data-mobile-responsive="true">
                       <thead>
                           <tr>
							<th data-field="createTime">日期</th>
                             <th data-field="regCountTotal">注册总人数</th>
                             <th data-field="chargeRoomCards">充值总房卡数</th>
							 <th data-field="chargeGoldCoins">充值总金币数</th>
                             <th data-field="money">充值总金额</th>
							 <th data-field="consumeRoomCards">售出房卡数</th>
							 <th data-field="playCount">游戏总局数</th>
							 <th data-field="newRegCount">新增注册人数</th>
							 <th data-field="loginCount">日活动人数</th>
                           </tr>
                       </thead>
                   </table>
                   <div id="echart-container" style="height:600px"></div>
                   <!-- <div class="my-pagination">
                       <div class="m-style M-box11"></div>
                   </div> -->
            </div>
        </div>
    </div>

    <script src="../../../static/js/jquery.min.js?v=2.1.4"></script>
    <script src="../../../static/js/bootstrap.min.js?v=3.3.5"></script>
    <script src="../../../static/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
    <script src="../../../static/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
    <script src="../../../static/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
    <script src="../../../static/js/plugins/datepicker/bootstrap-datepicker.min.js"></script>
    <script src="../../../static/js/plugins/pagination/jquery.pagination.js"></script>
    <script src="../../../static/js/plugins/popup/popup.js"></script>
	<script src="../../../static/js/echarts.min.js"></script>
	<script src="../../../static/js/http.js"></script>
    <script src="../../../static/js/statistic.js?v=1.0.7"></script>
    <script type="text/javascript">

    </script>
  </body>
</html>
